<template>
  <div>
    <div @click="back">
      <van-nav-bar left-text="返回" left-arrow @click-left="back" title="资讯" />
    </div>
    <div class="container">
      <div class="message-tips">请输入想资讯的内容 :</div>
      <div class="message-wrap">
        <textarea class="message-detail" cols="30" rows="10"></textarea>
        <div class="message-box"></div>
      </div>
    </div>

    <div class="bom_m">
      <h5>请上传相关的图片:</h5>
      <van-uploader v-model="fileList" multiple />
    </div>

    <div>
      <h6>请输入电话号码(必填):</h6>
      <input type="text" class="c" placeholder="手机号" />
    </div>
    <div class="cen">
       <el-button type="text" @click="open">点击质询</el-button>
    </div>
  
  </div>
</template>

<script>
import mixin from '@/mixin/flag'
import { cako } from '@/service/falv'
export default {
  mixins: [mixin],
  data() {
    return {
      fileList: [
        // Uploader 根据文件后缀来判断是否为图片文件
        // 如果图片 URL 中不包含类型信息，可以添加 isImage 标记来声明
      ],
    }
  },
  async mounted() {},
  methods: {
    back() {
      this.$router.push('/peopleView')
    },
    async zicunp() {
      const msg = await cako({
        lawyerId: 10,
        legalExpertiseId: 7,
        content: '要把沙发装冰箱，总共分几步？',
        imageUrls:
          'https://tse1-mm.cn.bing.net/th/id/OIP-C.5ZpY54WqzQVXu-rL7yg5hAHaJ4?w=203&h=271&c=7&r=0&o=5&dpr=1.5&pid=1.7',

        phone: '18842656666',
      })
      console.log('msg', msg)
    },
    open() {
        this.$confirm('资讯成功,3个工作日回复,请保持手机畅通', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          this.$message({
            type: 'success',
            message: '预约成功!'
          });
           this.zicunp()
        this.fileList = []
        var a = document.getElementsByClassName("message-detail")[0];
        a.value = "";
        var b = document.getElementsByClassName("c")[0];
        b.value = "";
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消预约'
          });
        });
       
      }
  },
}
</script>

<style lang="scss" scoped>
.bom_m {
  margin-top: 15px;
  h5 {
    font-size: 15px;
    margin-bottom: 10px;
  }
}
h6 {
  font-size: 15px;

  margin: 10px 0;
}
.cen {
  width: 100px;
  height: 40px;
  border: 1px solid pink;
  margin-left: 130px;
  margin-top: 20px;
  padding-left: 40px;
}
.container {
  width: 800px;
  margin: 0 auto;
  font-size: 13px;
}
.message-tips {
  margin: 10px 0;
}
.container .message-detail {
  width: 100%;
  display: block;
  outline: none;
  resize: none;
  padding: 5px;
  box-sizing: border-box;
}

.message-box {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}

.message-list {
  margin-top: 50px;
}

/* .message-list li {
            display: flex;
        } */

.message-list li .nick {
  width: 100px;
}

.message-list li .content {
  text-indent: 2em;
}
</style>